<template>
  <view class="tem-main">
    <view class="tem-header">
      <view class="my-title-img">
        <!-- <image src="../../static/img/touxiang2.png" mode="" v-if="show"></image> -->
        <image :src="yonghuwx.avatarUrl"></image>
        <!-- <web-view src="https://www.baidu.com/"></web-view> -->
      </view>
    </view>
    <view class="tem-report">
      <view class="tem-content">
        <view class="info-content">
          <view class="info-main">
            <form @submit="formSubmit">
              <view class="uni-form-item uni-column">
                <view class="item-content">
                  <view class="title item-content-title">姓名：</view>
                  <view class="item-content-text">
                    {{ name }}
                  </view>
                </view>
                <!-- <view class="title">姓名</view>
              <input class="uni-input" name="name" placeholder="输入姓名" /> -->
              </view>

              <view class="uni-form-item uni-column">
                <view class="item-content">
                  <view class="title item-content-title">年龄：</view>
                  <view class="item-content-text">
                    {{ age }}
                  </view>
                </view>
              </view>
              <view class="uni-form-item uni-column">
                <view class="item-content">
                  <view class="title item-content-title">性别：</view>
                  <view class="item-content-text">
                    <radio-group name="gender">
                      <label>
                        <radio
                          style="transform: scale(0.7)"
                          color="#20b1ff"
                          value="男"
                          :checked="radio1"
                        />
                        <text>男</text>
                      </label>
                      <label>
                        <radio
                          style="transform: scale(0.7)"
                          color="#20b1ff"
                          :checked="radio0"
                          value="女"
                        />
                        <text>女</text>
                      </label>
                    </radio-group>
                  </view>
                </view>
              </view>
              <view class="uni-form-item uni-column">
                <view class="item-content">
                  <view class="title item-content-title">是否户主：</view>
                  <view class="item-content-text">{{ master }}</view>
                </view>
              </view>
              <view class="uni-form-item uni-column">
                <view class="item-content">
                  <view class="title item-content-title">电话：</view>
                  <view class="item-content-text">
                    {{ phoneNumber }}
                  </view>
                </view>
              </view>

              <view class="uni-form-item uni-column">
                <view class="item-content">
                  <view class="title item-content-title">住址：</view>
                  <view class="item-content-text">
                    {{ address }}
                  </view>
                </view>
              </view>

              <!-- <view class="uni-btn-v">
                <button plain="true" form-type="submit">立即上报</button>
               
              </view> -->
            </form>
          </view>
        </view>
      </view>
    </view>
  </view>
</template>

<script>
import { testInfo } from "@/util/testInfo.js";
export default {
  data() {
    return {
      name: "1",
      age: "2",
      radio0: false,
      radio1: false,
      phoneNumber: "3",
      address: "4",
      yonghuwx: {},
      master: "是",
      openid: "",
    };
  },
  onShow() {
    let that = this;
    uni.getStorage({
      key: "userInfo",
      success: function (res) {
        // console.log(res);
        that.yonghuwx = res.data;
        that.show = false;
      },
      fail: (err) => {
        that.show = true;
      },
    });
    this.getPeopleInfo();
  },
  components: {},
  methods: {
    //获取默认的信息
    getPeopleInfo() {
      let that = this;
      uni.getStorage({
        key: "openid",
        success: function (res) {
          // console.log(res);
          that.openid = res.data;
          that
            .$MyRequest({
              url: "/get_all_people",
              method: "POST",
              data: {
                openid: that.openid,
              },
            })
            .then((res) => {
              // console.log(res);
              let defaultdata = res.data.data[0];
              that.name = defaultdata.name;
              that.address = defaultdata.address;
              that.age = defaultdata.age;
              that.phoneNumber = defaultdata.phone;
              if (defaultdata.gender == 1) {
                that.radio1 = true;
              } else {
                that.radio0 = true;
              }
            });
          that
            .$MyRequest({
              url: "/test_pay_apply",
              method: "POST",
              data: {
                openid: that.openid,
              },
            })
            .then((res) => {
              if (res.data.mesg == 3) {
                that.master = "是";
              } else {
                that.master = "否";
              }
            });
        },
        fail: (err) => {},
      });
    },

    //上报,暂时没用，可以保留做成修改信息
    formSubmit(e) {
      let formdata = e.detail.value;
      // console.log(formdata);
      let tem =
        this.arrData[0][this.dataIndex] +
        "." +
        this.arrData[1][this.dataIndexOne];
      // console.log(tem);
      this.$MyRequest({
        url: "/set_tem_report",
        method: "POST",
        data: {
          openid: this.openid,
          name: formdata.name,
          age: formdata.age,
          gender: formdata.gender,
          phoneNumber: formdata.phoneNumber,
          address: formdata.address,
          tem: tem,
          time: this.date + " " + this.time,
        },
      }).then((result) => {
        // console.log(result);
        if (result.data.mesg == "已上报") {
          let that = this;
          uni.showModal({
            title: "提示",
            content: "今日已上报",
            success: function (res) {
              if (res.confirm) {
                console.log("用户点击确定");
                // that.temList();
              } else if (res.cancel) {
                console.log("用户点击取消");
              }
            },
          });
        } else {
          // 上报成功跳转
          uni.showToast({
            title: "上报成功",
            duration: 1500,
          });
          setTimeout(() => {
            this.temList();
          }, 1500);
        }
        // uni.navigateTo({ url: "/pages/home/service/TemperatureList" });
      });
    },
  },
};
</script>

<style lang="scss">
@import "@/static/styles/mixin.scss";
.tem-main {
  height: 100vh;
  background-color: $uni-color-indexBg;
}
.tem-header {
  background-color: rgb(24, 189, 218);
  height: 250rpx;
  // @include center;
  // padding-top: 100rpx;
  .my-title-img {
    padding-top: 60rpx;
    @include center;
    image {
      @include center;
      width: 110rpx;
      height: 110rpx;
      border-radius: 50%;
      background-color: #ffffff;
    }
  }
}
.tem-report {
  position: absolute;
  top: 200rpx;
  left: 0;
  z-index: 300;
  width: 100%;
  // height: 100vh;
  // background-color: $uni-color-indexBg;
  padding: 10rpx 30rpx;
  padding-top: 0;
  box-sizing: border-box;
  .tem-content {
    background-color: $uni-color-mainBg;
    box-sizing: border-box;
    padding: 0 12rpx;
    border-radius: 2%;
    .info-content {
      // box-sizing: border-box;
      // padding: 0 15rpx;
      margin: 0 15rpx;
      // border-radius: 2%;
      // background-color: $uni-color-mainBg;
      // margin-bottom: 50rpx;
      .info-main {
        padding: 0 15rpx 35rpx 15rpx;
        background-color: $uni-color-mainBg;
        box-sizing: border-box;
        .uni-column {
          border-bottom: 1rpx solid #d8d8de;
          padding: 12rpx 0;
          .item-content {
            display: flex;
            align-items: center;
            .title {
              // font-size: 55rpx;
              font-size: 30rpx;
              padding: 20rpx 0;
            }
            .item-content-text {
              padding-left: 80rpx;
              font-size: 30rpx;
              color: #5c5a5a;
            }
          }
          // .title {
          //   padding: 30rpx 0;
          // }
        }
        .uni-btn-v {
          padding: 50rpx 0 20rpx 0;
          // border-top: 0 20rpx solid;
          button {
            width: 50%;
            border-radius: 30rpx;
            font-size: 24rpx;
            color: #fff;
            // size: 10;
            height: 70rpx;
            @include center;
            background-color: $uni-color-primary;
            border: none;
          }
        }
      }
      .info-step {
        // margin-top: 20%;
        width: 100%;
        padding: 30rpx 0;
        box-sizing: border-box;
        // marggn-top: 100rpx;
        // background-color: $uni-color-mainBg;
        .uni-steps {
          // height: 200rpx;
          background-color: $uni-color-mainBg;
          active-color: $uni-color-primary;
          // transform: scale(1.1);
          padding: 60rpx 0;

          box-sizing: border-box;
          // @include center;
          // font-size:80rpx;
          .uni-steps__row {
            // transform: scale(1.8);
          }
        }
      }
      .info-step-test {
        background-color: $uni-color-mainBg;
        padding: 0 0 20rpx 0;
        @include center;
        color: $uni-color-warning;
      }
    }
  }
}
</style>
